<template>
  <div style="width: 800px; margin: 100px auto">

     <public-table ref="table"
                   :data="tableData"
                   :total="total"
                   :request="getListData">
         <el-table-column
                 type="selection"
                 width="55">
         </el-table-column>
         <el-table-column
                 prop="name"
                 label="用户名称"
                 align="center"
                 width="200"
         />
         <el-table-column
                 prop="sex"
                 label="性别"
                 align="center"
         >
             <template slot-scope="scope">
                 {{scope.row.sex===0?'女':'男'}}
             </template>
         </el-table-column>

         <el-table-column
                 label="操作"
                 fixed="right"
                 align="center"
         >
             <template slot-scope="scope">
                 <el-button  type="text" size="small" @click="update(scope.row.id)">修改</el-button>
                 <el-button  type="text" size="small" @click="show(scope.row.id)">查看</el-button>
             </template>
         </el-table-column>

     </public-table>
  </div>
</template>
<script>
//引入组件
import PublicTable from '@/components/PublicTable/index'
export default {
  //注册组件
  components: {
    PublicTable
  },
  data() {
    return {
        total: 2, // 总条数
        tableData: [{// 表格数据
            name:'小明',
            sex:'男',
            id: '0001'
        },{
            name:'小花',
            sex:'女',
            id: '0002'
        }]
    }
  },
  methods:{
      getListData(){ // 通过接口获取列表数据

      },
      update(id) {
           alert('修改'+id)
      },
      show(id){
          alert('查看'+id)
      }
  }
};
</script>
<style scoped >

</style>
